<template>
	<view>
		<u-navbar title="消息详情" :autoBack="true">
		</u-navbar>

		<view class="top m-b-30"></view>

		<view class="p-l-30 p-r-28">
			<view class="h-112 flex-between">
				<view class="flex">
					{{info.title}}
				</view>
				<view class="font-24 color-a">{{ info.create_time | date('yyyy-mm-dd') }}</view>
			</view>
			<u-parse :content="info.content"></u-parse>
			<!-- <view v-html="info.content"></view> -->
		</view>
		<view class="h-68"></view>
	</view>
</template>

<script>
	export default {
		name: 'msgDetails',
		data() {
			return {
				id: '',
				info: {}
			}
		},
		onLoad(ops) {
			if (ops.id) {
				this.id = ops.id
				this.messageDetail()
			}
		},
		methods: {
			async messageDetail() {
				const res = await this.$api.common.system('messageDetail', {
					id: this.id
				})

				if (res.code === 200) {
					this.info = res.data
				}

			},
		}
	}
</script>

<style lang="scss" scoped>
	.badge {
		width: 20rpx;
		height: 20rpx;
		border-radius: 50%;
		background-color: $e;
		margin-left: 8rpx;
		transform: translateY(-10rpx);
	}
</style>
